<%@ page contentType="text/html; charset=UTF-8"%>
<%@ include file="/jsp/taglib.jsp"%>
<%@page import="com.framework.utils.ConfigUtil"%>
<!DOCTYPE html>
<html>
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>活动设置</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico">
    <link href="${ctxStatic}/plugins/h+/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/animate.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/style.min862f.css?v=4.1.0" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="${ctxStatic}/plugins/h+/css/plugins/webuploader/webuploader.css">
    <link href="${ctxStatic}/plugins/h+/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
    <style>
        .ml10 {
            margin-left: 15px;
        }

    </style>

</head>

<body class="gray-bg" >
<div class="wrapper wrapper-content  animated fadeInRight" id="ccbb">
    <div class="row">
        <div class="col-sm-12">
            <div class="toolbar">
                <div id="toolbar">
                    <button id="btn_add" class="btn btn-primary"><i class="fa fa-plus-circle"></i>&nbsp;新增</button>
                    <button id="btn_del" class="btn btn-w-s btn-danger"><i class="fa fa-times-circle"></i>&nbsp;批量删除</button>
                </div>
            </div>
            <span id="spancc" class="spancc"></span>
            <div class="row">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>搜索条件</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content" >
                        <div class="row">
                            <div class="col-md-2"><input placeholder="名称" id="search_customer" class="form-control"></div>
                            <div class="col-md-1"><button id="btn_search" class="btn btn-primary"><i class="fa fa-search"></i>&nbsp;搜索</button></div>
                        </div>
                    </div>
                </div>
            </div>
            <table id="exampleTablePagination"></table>
        </div>
    </div>
</div>
    <script src="${ctxStatic}/plugins/h+/js/jquery.min.js?v=2.1.4"></script>
    <script src="${ctxStatic}/plugins/h+/js/bootstrap.min.js?v=3.3.6"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/bootstrap-table.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/locale/bootstrap-table-zh-CN.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/extensions/export/bootstrap-table-export.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/extensions/editable/bootstrap-table-editable.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/sweetalert/sweetalert.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/content.min.js?v=1.0.0"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/layer/laydate/laydate.js"></script>
    <script>

    </script>
    <script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
    <script type="text/javascript">
        var picPath='<%=ConfigUtil.get("OSSURL")%>';
        var ajaxpath='${pageContext.request.contextPath}';
        //初始化表格对象
        var $table = $('#exampleTablePagination');

        function showPopupForEdit(id){
            //自定页
            parent.layer.open({
                type: 2,
                shift:4,//动画类型
                moveType:1,
                maxmin: true,
                shadeClose: true, //开启遮罩关闭
                area: ['800px', '600px'],
                content: '${pageContext.request.contextPath}/mebactivity/toEdit.ac?id='+id,
                success: function(layero, index){
                },
               cancel: function(index){
                    $table.bootstrapTable('refresh', queryParams);
                    return true;
                },      end:function(){
                    $table.bootstrapTable('refresh', queryParams);
                },
                close  : function(index){

                    $table.bootstrapTable('refresh', queryParams);
                }
            });
        }
        function showPopup(){
            //自定页
            parent.layer.open({
                type: 2,
                shift:4,//动画类型
                moveType:1,
                maxmin: true,
                shadeClose: true, //开启遮罩关闭
                area: ['800px', '600px'],
                content: '${pageContext.request.contextPath}/mebactivity/toAdd.ac',
                success: function(layero, index){
                },
                cancel: function(index){
                    $table.bootstrapTable('refresh', queryParams);
                    return true;
                },
                end:function(){
                    $table.bootstrapTable('refresh', queryParams);
                },
                close:function(index){

                    $table.bootstrapTable('refresh', queryParams);
                }
            });
        }

        ////////////////////////////////////////////////////////////////////////////////////////以下是通过js方式初始化BootStrapTable/////////////////////////////////////////////

        $table.bootstrapTable({
            url: "${pageContext.request.contextPath}/mebactivity/showMebactivity.ac",
            method: 'post',
            contentType: "application/x-www-form-urlencoded",//必须的
            dataType: "json",
            pageList:[10, 20, 50, 100],//会根据当前的数据量加载合适的pageList
            height: ($(window).height()-100) ,
            //cardView:true,//是否自适应手机
            pagination: true, //分页
            // queryParamsType: "limit",
            singleSelect: false,
            cache:false,
            sortName:"name",
            search: false, //显示搜索框
            showColumns:false,
            showRefresh:false,
            showToggle:false,
            showPaginationSwitch:false,
            smartDisplay:true,
            detailView:false,
            toolbar:"#toolbar",
            queryParams: queryParams,//参数
            searchOnEnterKey:true,
            detailFormatter:function(index, row, element){
                return row.customer;
            },
            sidePagination: "server", //服务端处理分页
            columns: [
                {
                    visible:false,
                    field:'id'
                },
                {
                    title:'选择',
                    align:'center',
                    formatter:stateFormatter,
                    checkbox:true
                },
                {
                    title: '主题',
                    field: 'subject',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center'
                }, {
                    title: '图片',
                    formatter:function (value, row, index) {
                        if(row.path!=null&&row.path!=undefined&&row.path!='')
                        { return '<image style="width:40px;height: 40px;" src="'+picPath+row.path+'"  />';}
                        else
                        { return '<image src="${ctxStatic}/plugins/nic/assets/admin/layout/img/logo.png"  />';}

                    },
                    align: 'center'
                },
                {
                    title: '活动时间',
                    field: 'activityTime',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center'
                },
                {
                    title: '活动地址',
                    field: 'activityAdd',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center'
                },
                {
                    title: '活动积分',
                    field: 'integral',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center'
                },
                {
                    title: '报名开始时间',
                    field: 'applyStartTime',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center'
                },
                {
                    title: '报名结束时间',
                    field: 'applyEndTime',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center'
                },
                {
                    title: '活动人数',
                    field: 'limitCount',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center'
                },
                {
                    title: '活动说明',
                    field: 'activityNotes',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center',
                    formatter:function(value,row,index) {
                        if (value.length<=10) {
                            return  value;
                        }else{
                            return value.substring(0,9)+'...';
                        }
                    }
                },
                {
                    title: '创建时间',
                    field: 'createTime',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center'
                },
                {
                    title: '状态',
                    field: 'state',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center',
                    formatter:function(value,row,index) {
                        if (value == '0') {
                            return  '未审核';
                        }else if(value=='1'){
                            return '已通过';
                        }else if(value=='2'){
                            return '已退回';
                        }else if(value=='3'){
                            return '已结束';
                        }
                    }
                },
                {
                    title: '审批人',
                    field: 'appUserName',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center',
                    formatter:function(value,row,index) {
                        if (value == '0') {
                            return  '-';
                        }else{
                            return value;
                        }
                    }
                },
                {
                    title: '审批时间',
                    field: 'approveTime',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center',
                    formatter:function(value,row,index) {
                        if (value == '0') {
                            return  '-';
                        }else{
                            return value;
                        }
                    }
                },
                {
                    title: '审批意见',
                    field: 'approveNotes',
                    titleTooltip: '点击可以进行排序操作',
                    sortStable:true,
                    align: 'center',
                    formatter:function(value,row,index) {
                        if (value == '0') {
                            return  '-';
                        }else{
                            return value;
                        }
                    }
                },
                {
                    title: '操作',
                    align: 'center',
                    events:{
                        'click .approve': function (e, value, row, index) {
                            showApprove(row.id);
                        },
                        'click .edit': function (e, value, row, index) {
                            // alert('You click edit icon, row: ' + JSON.stringify(row));
                            //弹出编辑层
                            showPopupForEdit(row.id);
                        },
                        'click .remove': function (e, value, row, index) {
                            var arr=[row.id];
                            deleteGrid(arr);
                        },'click .isOpen': function (e, value, row, index) {
                            // alert('You click edit icon, row: ' + JSON.stringify(row));
                            //弹出编辑层
                            changeIsOpen(row.id,row.isOpen);
                        }
                    },
                    formatter:function(value,row,index){
                        return [
                            '<a class="approve ml10" href="javascript:void(0)" title="查看">',
                            '<i class="glyphicon glyphicon-folder-close"></i>',
                            '</a>',
                            '<a class="edit ml10" href="javascript:void(0)" title="编辑">',
                            '<i class="glyphicon glyphicon-edit"></i>',
                            '</a>',
                            '<a class="remove ml10" href="javascript:void(0)" title="删除">',
                            '<i class="glyphicon glyphicon-remove"></i>',
                            '</a>'
    /*,
                            '<a class="list ml10" href="javascript:void(0)" title="帐号">',
                            '<i class="glyphicon glyphicon-list"></i>',
                            '</a>'*/
                        ].join('');
                    }
                }
            ]
        });

        /*
         搜索按钮
         */
        $("#btn_search").click(function(){
            $table.bootstrapTable('selectPage', 1);
            $table.bootstrapTable('refresh', queryParams);
        });

        /*
         传递的参数
         */
        function queryParams(params) {
            var temp = {  //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                limit: params.limit,  //页面大小
                offset: params.offset, //页码
                pageindex:params.pageNumber,
                customer: $("#search_customer").val(),
                page_type:'${page_type}'

            };
            return temp;
        }
        ///////////////////////////////////////////////////////////////toolbar///////////////////////////////////////
        //新增
        $("#btn_add").click(function(){
            showPopup();
        });

        //批量删除
        $("#btn_del").click(function(){
            var ids=getSelections();
            //执行批量删除
            deleteGrid(ids);
        });
        /*
         批量删除方法体
         */
        function deleteGrid(ids){
            if(ids.length>0){
                swal({
                    title: "您确定要删除这些信息吗",
                    text: "删除后将无法恢复，请谨慎操作！",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "删除",
                    cancelButtonText:"取消",
                    closeOnConfirm: false
                }, function () {
                    //执行批量删除
                    $.ajax( {
                        url:'${pageContext.request.contextPath}/mebactivity/delGridById.ac',// 跳转到 action
                        data:{
                            ids :ids.toString()
                        },
                        type:'post',
                        cache:false,
                        dataType:'json',
                        success:function(data) {
                            if(data.success){
                                swal("删除成功！", "您已经删除了这条信息。", "success");
                                //当前表格刷新
                                $table.bootstrapTable('refresh');
                            }else{
                                swal("删除失败！", "未能删除这些信息。", "error");
                            }
                        },
                        error : function() {
                            alert("异常！");
                        }
                    });

                });
            }else{
                sweetAlert("无法操作！", "请勾选需要删除的信息!", "error");
            }
        }

        //获取选中的CheckBox
        $("#btn_getCheck").click(function(){
            alert('getSelections: ' + JSON.stringify($table.bootstrapTable('getSelections')));
            alert("客户信息:"+$table.bootstrapTable('getSelections')[0].customer);
        });

        /*
         获取所有选中的CheckBox的主键值 【数组】
         */
        function getSelections() {
            return $.map($table.bootstrapTable('getSelections'), function (row) {
                return row.id;
            });
        }

        /*
         BootStrapTable CheckBox 状态初始化
         */
        function stateFormatter(value, row, index) {
            if (row.id === 2) {
                return {
                    disabled: true,
                    checked: true
                };
            }
            if (row.id === 0) {
                return {
                    disabled: true,
                    checked: true
                }
            }
            return value;
        }
function  doReload() {
    $table.bootstrapTable('refresh', queryParams);

}


        //查询报名信息
        function showDetail(id){
            //自定页
            parent.layer.open({
                type: 2,
                shift:4,//动画类型
                moveType:1,
                maxmin: true,
                shadeClose: true, //开启遮罩关闭
                area: ['1000px', '530px'],
                content: ajaxpath+'/mebactivity/showDetail.ac?id='+id,
                success: function(layero, index){
                    //调用成功执行
                    //$table.bootstrapTable('refresh', queryParams);
                    return true;
                },
                cancel: function(index){
                    return true;
                },
                close  : function(index){

                    $table.bootstrapTable('refresh', queryParams);
                }
            });
        }

        //修改开启关闭
        function changeIsOpen(id,isOpen) {
            isOpen=1-isOpen;
            $.ajax( {
                url:'${pageContext.request.contextPath}/mebactivity/changeIsOpen.ac',// 跳转到 action
                data:{id:id,isOpen:isOpen},
                type:'post',
                cache:false,
                dataType:'json',
                success:function(data) {
                    if(data.flag=="1"){
                        alert(data.msg);
                        $table.bootstrapTable('refresh', queryParams);
                    }else{
                        alert(data.msg);
                    }
                },
                error : function() {
                    alert("操作失败！");
                }
            });
        }


        //查看审批详情
        function showApprove(id){
            //自定页
            parent.layer.open({
                type: 2,
                shift:4,//动画类型
                moveType:1,
                maxmin: true,
                shadeClose: true, //开启遮罩关闭
                area: ['1000px', '530px'],
                content: ajaxpath+'/mebactivity/showApprove.ac?id='+id,
                success: function(layero, index){
                    //调用成功执行
                    //$table.bootstrapTable('refresh', queryParams);
                    return true;
                },
                cancel: function(index){
                    return true;
                },
                close  : function(index){

                    $table.bootstrapTable('refresh', queryParams);
                }
            });
        }
    </script>
</body>


</html>
